!(function(){

	const DATA_IDX = ' abcdefghijklmnopqrstuvwxyz'.split('');
	const MARK_REGEX = /\[(\w){1,1}\]/, SPLIT_REGEX = /[ \r\t\n;,；，]+/;
	let dataGroups = [], dataGroupCount = 0, $curEditDateItem;

	// $('.oi-collapse-left').click(function () {
	// 	let display = $(this).parent().find('button').eq(0).css('display');
	// 	if (display !== 'none') {
	// 		$(this).parent().find('button').css('display', 'none');
	// 		$('.data-groups').css('display', 'none');
	// 		$('.left-col').css('flex-grow', 0);
	// 	} else {
	// 		$(this).parent().find('button').css('display', 'inline-block');
	// 		$('.data-groups').css('display', 'block');
	// 		$('.left-col').css('flex-grow', 1);
	// 	}

	// 	$('.charts .chart > div').each(function(index, el) {
	// 		window.setTimeout(function () {
	// 			$(el).highcharts().reflow();	
	// 		}, 1000);	
	// 	});

	// });

	// $('.oi-collapse-right').click(function () {
	// 	let grow = +$('.right-col').css('flex-grow');
	// 	if (grow) {
	// 		$('.charts').css('display', 'none');
	// 		$('.right-col').css('flex-grow', 0);
	// 	} else {
	// 		$('.charts').css('display', 'block');
	// 		$('.right-col').css('flex-grow', 1);
	// 	}
	// });

	$('[data-action="addDataGroup"]').click(function(){
		dataGroups.push({});

		$('.data-group.template')
			.clone()
			.css('display', 'block')
			.removeClass('template')
			.data('idx', dataGroupCount++)
			.appendTo('.data-groups');
		$('[data-toggle="popover"]').popover();
	});

	$('.data-groups').on('click', '[data-action="delDataGroup"]', function(evt){
		let idx = +$(evt.target).closest('.data-group').data('idx');
		dataGroups.splice(idx, 1);
		dataGroupCount--;

		$(evt.target).closest('.data-group').remove();

		$('.data-groups .data-group').each(function(index) {
			$(this).data('idx', index);
		});
	});

	$('.data-groups').on('change', 'input[name="dateItem"]', function(evt){
		let $target = $(evt.target),
			dataVal = $target.val().trim(),
			dataArr = dataVal.split(SPLIT_REGEX),
			$prepend = $target.closest('.input-group').find('.input-group-prepend .input-group-text'),
			hasMark = !!$prepend.html(),
			idx = $target.closest('form').find('.form-group').index($target.closest('.form-group'));

		if (!hasMark) {
			$prepend.html('[' + DATA_IDX[idx] + ']' + dataArr[0]);
		}

		if (dataArr.length) {
			let dataGroup = dataGroups[+$target.closest('.data-group').data('idx')],
				firstVal = dataArr[hasMark ? 0 : 1];
			
			if (firstVal && firstVal.indexOf('F:') !== -1) {
				let formula = firstVal.replace('F:',''),
					firstMark = formula.replace(/[^a-z]/g, '').split('')[0];
				if (firstMark) {
					let len = dataGroup[firstMark].length, exp, result = [];
					for (let i = 0; i < len; i++) {
						exp = '';
						Object.keys(dataGroup).forEach(function(key){
							exp += 'var ' + key + '=' + dataGroup[key][i] + ';';
						});
						exp += formula;
						try {
							let value = eval(exp);
							console.log(i, 'exp....', exp, value);
							if (isNaN(value) || typeof value !== 'number') {
								window.alert('公式错误，请仔细检查公式以及所对应的数据');
								return;
							} else {
								result.push(value.toFixed(2));
							}
						} catch(e) {
							console.log('e', e);
							window.alert('公式错误，请仔细检查公式以及所对应的数据');
							return;
						}
					}

					dataGroup[DATA_IDX[idx]] = result;
					$target.val(result.join(','));
				}
			} else {
				let numbers = dataArr.slice(hasMark ? 0 : 1);
				dataGroup[DATA_IDX[idx]] = numbers;
				$target.val(numbers.join(','));
			}

			console.log('dataGroup,', dataGroup);
		}
	});

	$('.data-groups').on('dblclick', 'input[name="dateItem"]', function(evt){
		let $target = $(evt.target),
			dataVal = $target.val().trim(),
			$prepend = $target.closest('.input-group').find('.input-group-prepend .input-group-text');


		$curEditDateItem = $target;

		$('#dateItemDlg .modal-title').html($prepend.html());
		$('#dateItemDlg textarea').val(dataVal);

		$('#dateItemDlg').modal('show');
	});

	$('[data-action="saveDateItem"]').click(function(){
		if ($curEditDateItem) {
			$curEditDateItem.val($('#dateItemDlg textarea').val().trim().split(SPLIT_REGEX).join(','));
			$curEditDateItem.change();

			$('#dateItemDlg').modal('hide');
		}
	});

	$('.data-groups').on('click', '[data-action="compareDataItem"]', function(evt){
		let $inputGroup = $(evt.target).closest('.input-group'),
			val = $inputGroup.find('input[name="dateItem"]').val().split(SPLIT_REGEX),
			markHtml = $inputGroup.find('.input-group-prepend .input-group-text').html(),
			title = markHtml.replace(MARK_REGEX, ''),
			result = [];

		if (val.length > 1) {
			for (let i = val.length - 1; i > 0; i--) {
				console.log('val[i-1]', val[i-1], val[i], parseFloat(val[i-1]) - parseFloat(val[i]))
				result.unshift(((parseFloat(val[i-1]) - parseFloat(val[i]))/parseFloat(val[i]) * 100).toFixed(2));
			}
			result.push(0);
			result.unshift(title + '（环比）');
		}

		$('.data-item.template')
			.clone()
			.css('display', 'block')
			.removeClass('template')
			.appendTo($(evt.target).closest('.card-body').find('form'))
			.find('input[name="dateItem"]')
			.val(result.join(','))
			.change();
	});

	$('.data-groups').on('click', '[data-action="delDataItem"]', function(evt){
		let $dataGroup = $(evt.target).closest('.data-group'),
			dataGroupIdx = +$dataGroup.data('idx'),
			dataGroup = dataGroups[dataGroupIdx],
			$delDom = $(evt.target).closest('.data-item'),
			delMarkHtml = $delDom.find('.input-group-prepend .input-group-text').html(),
			delMark = delMarkHtml ? delMarkHtml.match(MARK_REGEX)[1] : '';
		
		$delDom.remove();
		delMark && (delete dataGroup[delMark]);

		$dataGroup.find('form .form-group:gt(0)').each(function(index, el) {
			let $mark = $(this).find('.input-group-prepend .input-group-text'),
				markHtml = $mark.html(),
				mark = markHtml ? markHtml.match(MARK_REGEX)[1] : '',
				newMark = DATA_IDX[index + 1];

			if (mark) {
				dataGroup[newMark] = dataGroup[mark];
				newMark !== mark && (delete dataGroup[mark]);
				$mark.html($mark.html().replace(MARK_REGEX, '[' + newMark + ']'));
			}
		});

		console.log('dataGroups...', dataGroupIdx, dataGroups);

	});

	$('.data-groups').on('click', '[data-action="addDataItem"]', function(evt){
		$('.data-item.template')
			.clone()
			.css('display', 'block')
			.removeClass('template')
			.appendTo($(evt.target).closest('.card-body').find('form'));
	});

	$('.data-groups').on('click', '[data-action="createChart"]', function(evt){
		$('.data-group:not(.template)').each(function(dgIdx, dg) {
			let xAxis = $(this).find('.xaxis').val();
			if (!xAxis) {
				window.alert('请填写第' + (dgIdx+1) + '数据组横轴数据')
				return;
			}
			if (!$(this).find('.data-item:not(.template)').length) {
				window.alert('请添加第' + (dgIdx+1) + '数据组数据')
				return;
			}

			let options = {
				categories: $(this).find('.xaxis').val().split(SPLIT_REGEX),
				series: [],
				idx: dgIdx
			}, needTwoAxis = false;
			$(this).find('.data-item:not(.template)').each(function(diIdx, di) {
				let serieLabel = $(this).find('.input-group-prepend .input-group-text').html(),
					serisData = $(this).find('[name="dateItem"]').val(),
					serie = {},
					axisType = $(this).find("[name='axisType']").val();

				if (serieLabel && serisData) {
					!needTwoAxis && (needTwoAxis = axisType === '1');

					serie.name = serieLabel.replace(MARK_REGEX, '');
					serie.type = $(this).find('[name="chartType"]').val();
					serie.data = serisData.split(SPLIT_REGEX).map(d => isNaN(+d) ? parseFloat(d) : +d);
					serie.yAxis = +axisType;
				}

				if (serie.type) {
					options.series.push(serie);
				}
			});

			if (needTwoAxis) {
				options.yAxis = [{title:null}, {title: null,  opposite: true}]
			}

			createChart(options);
		});
	});

	function createChart (options) {
		console.log('options...', options)
		let chart = $('.chart.template').clone().css('display','block').removeClass('template').data('idx', options.idx).appendTo('.charts');
		var myChart = Highcharts.chart(chart.find('div').get(0), {
			title: {
			    text: null
			},
			credits: {
        		text: 'fund.oppsis.com',
        		href: 'http://fund.oppsis.com'
    		},
			legend: {
        		enabled: true,
        		verticalAlign: 'top'
    		},
			xAxis: {
			    categories: options.categories
			},
			yAxis: options.yAxis || {},
			series: options.series
		});
	}

	$('.charts').on('click', '[data-action="delChart"]', function(evt){
		let chart = $(evt.target).closest('div').find('> div').highcharts();
		chart.destroy();
		$(evt.target).closest('div').remove();
	});

})();